<template>
  <view class="bg-white">
	<!--搜索栏-->
	<view class="cu-bar search bg-gradual-red">
		<view class="search-form round">
			<text class="cuIcon-search"></text>
			<input v-model="search" placeholder="search" />
		</view>
		<view class="action">
			<text style="font-size: 150%;" class="cuIcon-scan"></text>
		</view>
	</view>
	<!--搜索栏-->
	<!-- 悬浮 -->
    <view class="title_wrap ">
      <view class="title_in bg-white">
        <uni-segmented-control
          :current="current"
          :values="items.map(v=>v.title)"
          @clickItem="handleClick"
          style-type="text"
          active-color="#feb2b2"
        ></uni-segmented-control>
      </view>
    </view>

    <view class="home_content">
      <view v-if="current === 0">
        <home></home>
      </view>
      <view v-if="current === 1">
        <goods></goods>
      </view>
	  <view v-if="current === 2">
	    <carts></carts>
	  </view>
	  <view v-if="current === 3">
	    <mine></mine>
	  </view>
    </view>
  </view>
</template>

<script>
import { uniSegmentedControl } from "@dcloudio/uni-ui";
import { uniIcons } from "@dcloudio/uni-ui";
import { uniSearchBar } from "@dcloudio/uni-ui";
import home from "./home";
import mine from "./mine";
import carts from "./carts";
import goods from "./goods";


export default {
  components: {
    uniSegmentedControl,
    uniIcons,
	mine,
	carts,
	goods,
	home,
    uniSearchBar,
   
  },
  methods: {
    handletest() {
      console.log(current);
    },
    handleClick(e) {
      if (this.current != e.currentIndex) {
        this.current = e.currentIndex;
      }
    }
  },
  data() {
    return {
		
	  search:"",
      current: 0,
      items: [{ title: "首页" }, { title: "分类" },{ title: "购物车" },{ title: "我的" }],
    };
  }
};
</script>

<style lang="scss" scoped>
.search_btn {
  padding: 10rpx;
}

.title_wrap {
	
  .left_btn {
  }
  .right_btn {
  }
  .title_in {
    margin: 0 auto;
    width: 90%;
  }
}
</style>